<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="widtd=device-widtd, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>bookList</title>
    <!-- Bootstrap -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
</head>
<body>

<h1 class="text-center">欢迎来到购书系统</h1>
<br><br>
<div class="page-header">

    <div >
        <h3 th:text="欢迎+${session.user.getUserName()}+用户"></h3>
        <h3 class="pull-right"><a th:href="@{/login}" class="nav-link logout"> <span class="d-none d-sm-inline">退出</span><i class="fa fa-sign-out"></i></a></h3>
    </div>

</div>
    <form  class="form-inline text-center" th:action="@{/pagination}" method="get">
        <div class="form-group">
            <select class="form-control" name="typeId" >
                <option value="0" th:selected="${typeId==0}">全部图书类型</option>
                <option value="1" th:selected="${typeId==1}">小说</option>
                <option value="2" th:selected="${typeId==2}">文学</option>
                <option value="3" th:selected="${typeId==3}">科技</option>
                <option value="4" th:selected="${typeId==4}">少儿</option>

            </select>
        </div>
        <div class="form-group">
            <label for="exampleInputName2">&nbsp;&nbsp;&nbsp;&nbsp;图书名称</label>
            <input type="text" name="title" class="form-control" th:value="${title}" id="exampleInputName2" placeholder="请输入图书名称">
            <input  type="text" name="currentPage"  hidden>
        </div>
        <button type="submit" class="btn btn-sm btn-primary">搜索</button>
        <div class="form-group">
            <select class="form-control" name="isBorrow">
                <option value="-1" th:selected="${isBorrow==-1}">图书状态</option>
                <option value="0" th:selected="${isBorrow==0}">未借阅</option>
                <option value="1" th:selected="${isBorrow==1}">已借阅</option>
            </select>
        </div>
    </form>
<br><br>
<div class="container-fluid col-lg-12">
    <table class="table table-bordered table-hover text-center">
        <!-- On rows -->
        <tr>
            <th class="text-center">图书编号</th>
            <th class="text-center">图书分类</th>
            <th class="text-center">图书名称</th>
            <th class="text-center">作者</th>
            <th class="text-center">出版社</th>
            <th class="text-center">操作</th>
        </tr>
        <tr class="success" th:each="bookInfo,bookStat:${pageBean.getList()}" th:class="${bookStat.count}%2==0?'':'success'">
            <td th:text="${bookInfo.getBooKCode()}"></td>
            <td th:switch="${bookInfo.getBookType()}">
                <span th:case="1">小说</span>
                <span th:case="2">文学</span>
                <span th:case="3">科技</span>
                <span th:case="4">少儿</span>
            </td>
            <td th:text="${bookInfo.getBookName()}"></td>
            <td th:text="${bookInfo.getBookAuthor()}"></td>
            <td th:text="${bookInfo.getPublishPress()}"></td>
            <td><a href="#">申请借阅</a></td>
        </tr>
    </table>
</div>

    <nav aria-label="Page navigation">
        <ul class="pagination">
            <li>
                <a id="pre"  th:href="@{/pagination/(typeId=${typeId},title=${title},isBorrow=${isBorrow},currentPage=${pageBean.getCurrentPage()==1?1:pageBean.getCurrentPage()-1})}" aria-label="Previous">
                    <span aria-hidden="true">&laquo;</span>
                </a>
            </li>
            <li  th:each="i:${#numbers.sequence(1, pageBean.getTotalPage())}"  th:class="${pageBean.getCurrentPage()==i?'active':''}"><a id="page" th:href="@{/pagination/(typeId=${typeId},title=${title},isBorrow=${isBorrow},currentPage=${i})}" th:text="${i}">1</a></li>
            <li>
                <a id="next" th:href="@{/pagination/(typeId=${typeId},title=${title},isBorrow=${isBorrow},currentPage=${pageBean.getCurrentPage()==pageBean.getEnd()?pageBean.getEnd():pageBean.getCurrentPage()+1})}" aria-label="Next">
                    <span aria-hidden="true">&raquo;</span>
                </a>
            </li>
        </ul>
    </nav>


<script th:src="@{/webjars/jquery/3.4.1/jquery.js}"></script>

<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script>
</body>
</html>